<?php
$this->breadcrumbs = array(
    'Dashboard - Quick link'
);
?>
<div class="tac">
    <a class="quick-btn" href="#">
        <i class="icon-bolt icon-2x"></i>
        <span>inverse</span>
        <span class="label label-inverse">2</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-check icon-2x"></i>
        <span>important</span>
        <span class="label label-important">2</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-building icon-2x"></i>
        <span>No Label</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-envelope icon-2x"></i>
        <span>success</span>
        <span class="label label-success">-456</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-signal icon-2x"></i>
        <span>warning</span>
        <span class="label label-warning">+25</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-external-link icon-2x"></i>
        <span>&pi;</span>
        <span class="label btn-metis-2">3.14159265</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-lemon icon-2x"></i>
        <span>&eacute;</span>
        <span class="label btn-metis-4">2.71828</span>
    </a>
    <a class="quick-btn" href="#">
        <i class="icon-glass icon-2x"></i>
        <span>&phi;</span>
        <span class="label btn-metis-3">1.618</span>
    </a>
</div>
<hr>
<div class="row-fluid">
    <div class="box">
        <header>
            <h5>Line Chart</h5>
        </header>
        <div class="body">
            <div id="chart_div" style="height: 500px;"></div>
        </div>
    </div>
</div>
<script>


    /*--------------------------------------------------------
     BEGIN DASHBOARD SCRIPTS
     ---------------------------------------------------------*/
    function dashboard() {

        /*----------- BEGIN SPARKLINE CODE -------------------------*/
        /* required jquery.sparkline.min.js*/

        /** This code runs when everything has been loaded on the page */
        /* Inline sparklines take their values from the contents of the tag */
        $('.inlinesparkline').sparkline();

        /* Sparklines can also take their values from the first argument
         passed to the sparkline() function */
        var myvalues = [10, 8, 5, 7, 4, 4, 1];
        $('.dynamicsparkline').sparkline(myvalues);

        /* The second argument gives options such as chart type */
        $('.dynamicbar').sparkline(myvalues, {type: 'bar', barColor: 'green'});

        /* Use 'html' instead of an array of values to pass options
         to a sparkline with data in the tag */
        $('.inlinebar').sparkline('html', {type: 'bar', barColor: 'red'});


        $(".sparkline.bar_week").sparkline([5, 6, 7, 2, 0, -4, -2, 4], {
            type: 'bar',
            height: '40',
            barWidth: 5,
            barColor: '#4d6189',
            negBarColor: '#a20051'
        });

        $(".sparkline.line_day").sparkline([5, 6, 7, 9, 9, 5, 4, 6, 6, 4, 6, 7], {
            type: 'line',
            height: '40',
            drawNormalOnTop: false
        });

        $(".sparkline.pie_week").sparkline([1, 1, 2], {
            type: 'pie',
            width: '40',
            height: '40'
        });

        $('.sparkline.stacked_month').sparkline(['0:2', '2:4', '4:2', '4:1'], {
            type: 'bar',
            height: '40',
            barWidth: 10,
            barColor: '#4d6189',
            negBarColor: '#a20051'
        });
        /*----------- END SPARKLINE CODE -------------------------*/

    }
    /*--------------------------------------------------------
     END DASHBOARD SCRIPTS
     ---------------------------------------------------------*/

    dashboard();

    google.load("visualization", "1", {packages: ["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var data = google.visualization.arrayToDataTable([
            ['Year', 'Sales', 'Expenses'],
            ['2004', 1000, 400],
            ['2005', 1170, 460],
            ['2006', 660, 1120],
            ['2007', 1030, 540]
        ]);

        var options = {
            title: 'Company Performance',
            hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
        };

        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    }

</script>